<template>
  <!-- 新增 搜索 -->
  <div>
    <TopFilter :list="topFilterList" :cols="4" :labelWidth="90" :rows="2" @filterChange="getParInfos" @onCollapse="collapseHandle"></TopFilter>
    <!-- 表格 -->
    <FilterTable
      ref="table"
      columnsRef="partPartInfoManagePartInfoIndex"
      :columns="columns"
      :fetchapi="fetchApi"
      :params="fetchParams"
      :datakey="'rows'"
      selectionType="single"
      :onColumnsChange="columns => (this.columns = columns)"
      :onRowSelectChange="arr => (this.onChangeColumn = arr)"
      :onSyncTableData="columns => (this.syncTableList = columns)"
    >
    </FilterTable>
    <div class="btnWrap">
      <el-button @click="$emit('close')">取 消</el-button>
      <el-button type="primary" @click="confirmBtnClick">确 定</el-button>
    </div>
  </div>
</template>

<script>
import { dictionary } from '@/utils/dictMixin';
import { exportExcelFile, arrayObjDeWeight } from '@/utils/index';
import { queryPartInfo, queryPartStock } from '@/api/part/partOutbound/repairMaterials/index.js';
import { getPinpSelect } from '@/api/repair/repairReception/customer/brand.js';
import { queryPartInfos, partExport, queryUnitCode } from '@/api/part/partInfo';
export default {
  name: 'chosePart',
  mixins: [dictionary],
  // props: ['FfetchParams'],
  data() {
    return {
      topFilterList: this.createTopFilterList(),
      onChangeColumn: [],
      columns: this.createColumns(),
      fetchApi: queryPartInfos,
      fetchParams: { pageNum: 1, xhrAbort: true }
    };
  },
  created() {
    this.getUnit();
    // this.getBrand();
  },
  mounted() {
    // this.getParInfos(this.FfetchParams);
  },
  methods: {
    createTopFilterList() {
      return [
        {
          type: 'INPUT',
          label: '配件代码',
          fieldName: 'partNo',
          placeholder: '请输入...'
        },
        {
          type: 'INPUT',
          label: '配件名称',
          fieldName: 'partName',
          placeholder: '请输入...'
        }
      ];
    },
    createColumns() {
      return [
        {
          title: '序号',
          sorter: true,
          width: 70,
          dataIndex: 'xuhao',
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        // {
        //   title: '品牌',
        //   // sorter: true,
        //   dataIndex: 'brand',
        //   filter: true,
        //   filterType: 'SELECT',
        //   dictItems: [
        //     { text: 'BEIJING', value: 'beqi' },
        //     { text: 'ARCFOX', value: 'arc' }
        //   ]
        // },
        {
          title: '配件代码',
          // sorter: true,
          dataIndex: 'partNo',
          filter: true,
          filterType: 'input'
        },
        {
          title: '配件名称',
          // sorter: true,
          dataIndex: 'partName',
          filter: true,
          filterType: 'input'
        },
        {
          title: '单位',
          dataIndex: 'unitCode',
          // filter: true,
          filterType: 'checkbox',
          filterItem: 'unitCode',
          dictItems: [],
          filterItems: []
        },
        {
          title: '配件属性',
          dataIndex: 'partType',
          filter: true,
          filterType: 'checkbox',
          filterItems: this.createDictList('5000'),
          dictItems: this.createDictList('5000')
        },
        {
          title: '数据来源',
          dataIndex: 'downTag',
          filter: true,
          filterType: 'checkbox',
          filterItems: [
            { text: '厂端下发', value: 10041001 },
            { text: '店端自建', value: 10041002 }
          ],
          dictItems: [
            { text: '厂端下发', value: 10041001 },
            { text: '店端自建', value: 10041002 }
          ]
        },
        {
          title: '终端建议零售VIP价格',
          dataIndex: 'notTaxInstructPrice',
          filter: true,
          precision: 2,
          filterType: 'number'
        },
        {
          title: '常规订货价',
          dataIndex: 'planPrice',
          filter: true,
          filterType: 'number',
          precision: 2
        },
        {
          title: '终端建议零售价格',
          dataIndex: 'insurancePrice',
          filter: true,
          filterType: 'number',
          precision: 2
        }
      ];
    },
    async getUnit() {
      const res = await queryUnitCode();
      console.log(res, 'res::');
      let data = arrayObjDeWeight(res.data, 'UNIT_CODE');
      this.columns.find(item => item.dataIndex == 'unitCode').dictItems = data.map(x => ({ text: x.UNIT_NAME, value: x.UNIT_CODE }));
      this.columns.find(item => item.dataIndex == 'unitCode').filterItems = data.map(x => ({ text: x.UNIT_NAME, value: x.UNIT_CODE }));
    },
    // 查询品牌
    async getBrand() {
      // const res = await getBrandList();
      const res = await getPinpSelect();
      this.columns.find(item => item.dataIndex == 'brand').dictItems = res.data.map(x => ({ text: x.brandName, value: x.brandCode + '' }));
    },
    collapseHandle() {
      this.$nextTick(() => {
        this.$refs.basetablewas.EXECUTE_RESET_HEIGHT();
      });
    },
    getParInfos(val) {
      this.fetchParams.xhrAbort = true;
      this.fetchParams = Object.assign(this.fetchParams, {
        xhrAbort: false,
        ...val,
        begin: val.begin ? val.begin.split(' ')[0] : '',
        end: val.end ? val.end.split(' ')[0] : ''
      });
    },
    // 确定
    confirmBtnClick() {
      console.log(this.onChangeColumn);
      this.$emit('onConfirm', this.onChangeColumn[0]);
    }
  }
};
</script>

<style scoped>
.btnWrap {
  position: absolute;
  left: 0px;
  bottom: 0px;
  right: 0px;
  z-index: 9;
  border-top: 1px solid rgb(233, 233, 233);
  padding: 10px 20px;
  background: rgb(255, 255, 255);
  text-align: right;
}
</style>
